<template>
    <view class="cu-form-group">
    	<view class="title">{{label}}</view>
		<view>
			<text class="padr3">{{valueInside?'是':'否'}}</text>
			<switch v-model="valueInside" @change="change" color="#39B54A" :class="valueInside?'checked':''" :checked="valueInside?true:false"></switch>
			
		</view>
    </view>
</template>

<script>
    export default {
        name: "sswitch",
        props: {
            value: {
				type:Boolean,
				default:false
			},
			model: "",
			label: {
				type:String,
				default:"未设置"
			},
			placeholder: {
				type:String,
				default:"请输入"
			}
        },
        data() {
            return {
                valueInside:''
            }
        },
        methods: {
           change(e){
			   this.valueInside = e.detail.value
			   	console.log(e.detail.value)
		   }
        },
        mounted() {
            
        },
		watch:{
			value(curVal,oldVal){
				console.log(curVal)
				console.log(oldVal)
				this.valueInside = curVal
			},
			valueInside(curVal,oldVal){
				console.log(curVal)
				console.log(oldVal)
				this.$emit('input',curVal)
			}
		}
    }
</script>

<style>
    .cu-form-group .title {
    	min-width: calc(4em + 15px);
    }
</style>
